<template>
	<view class="content">
		<view style="background: #fff;padding: 20px 0px;">
			<view class="line_title" style="color: #666;">
				贷款金额
			</view>
			<view class="big-number" style="color: #1e99ff;text-align: center;">{{info.capital}}</view>
		</view>
		
		<view class="mokuai" style="margin: 30rpx;padding: 30rpx;">
			<view class="info_title">
				贷款明细
			</view>
			<view class="clear shenhe-text" >
				<text class="left">申请时间 </text>
				<text class="right">{{info.addtime}}</text>
			</view>
			<view class="clear shenhe-text" >
				<text class="left">贷款明细 </text>
				<text class="right" >{{info.capital}}</text>
			</view>
			<view class="clear shenhe-text" >
				<text class="left">还款期限 </text>
				<text class="right">{{info.checktime3}}至{{info.endtime}}</text>
			</view>
			<view class="clear shenhe-text" >
				<text class="left" style="color: #666666;">查看合同 </text>
			</view>
			<view class="clear hetong-list">
				<view class="left" v-for="(item,index)  in hetong" :key="index">
					<image :src="item.url" @tap="yulan(item.url)"></image>
				</view>
				
			</view>
		</view>
		<view class="mokuai" style="margin: 30rpx;padding: 30rpx;">
			<view class="info_title" style="position: relative;">
			    客户信息
				<text class="info_more" @tap="lookmore(info.memberid)">查看更多</text>
			</view>
			<view class="clear shenhe-text" >
				<text class="left">客户姓名 </text>
				<text class="right" >{{info.username}}</text>
			</view>
			<view class="clear shenhe-text" >
				<text class="left">联系电话 </text>
				<text class="right" >{{info.member_info.mobile}}</text>
			</view>
			<view class="clear shenhe-text" >
				<text class="left">销售经理 </text>
				<text class="right">{{info.member_info.manage_name}}</text>
			</view>
		</view>
		<view class="mokuai" style="margin: 30rpx;padding: 30rpx;">
			<view class="info_title" style="position: relative;">
			    审核进度
			</view>
			<view class="clear shenhe-text">
				<view class="left">
					<icon type="success" style="margin-top: 10px;" size="18"></icon>
				</view>
				<text class="left shenhe-part " >提交审核</text>
				<text class="right" style="margin-top: 20rpx;">{{info.jindu_time1}}</text>
			</view>
			<view class="process">
				
			</view>
			<!-- 一级审核———————————————————————— -->
			<view class="clear shenhe-text">
				<view class="left">
					<icon type="success"size="18" v-if="info.check_user!=0&&info.check_error_level!=1"></icon>
					<icon type="clear" color="#ff5a5a" size="18" v-if="info.check_error_level==1"></icon>
					<icon type="success"size="18" color="#cccccc" v-if="info.is_check==0"></icon>
				</view>
				<text class="left shenhe-part ma_top" v-if="info.check_user!=0&&info.check_error_level!=1" >业务经理审核已通过</text>
				<text class="left shenhe-part ma_top"  style="color: #ff5a5a;" v-if="info.check_error_level==1">业务经理审核已驳回</text>
				<text class="left shenhe-part ma_top"  style="color: #a1a1a1;" v-if="info.is_check==0">待业务经理审核</text>
				<text class="right" style="margin-top: 20rpx;">{{info.jindu_time2}}</text>
			</view>
			<view class="process" v-if="info.is_check==0" style="color: #a1a1a1;border-left:1px solid #a1a1a1 ;">
				
			</view>
			<view class="process" v-if="info.check_user!=0&&info.check_error_level!=1">
				{{info.check_user_name}}
			</view>
			<view class="process"  style="color: #ff5a5a;border-left:1px solid #ff5a5a ;" v-if="info.check_error_level==1">
				{{info.error_reason}}
			</view>
			<!-- 二级审核———————————————————————— -->
			<view class="clear shenhe-text">
				<view class="left">
					<icon type="success" size="18"  v-if="info.is_check==2||info.is_check==3||info.check_error_level==3"></icon>
					<icon type="clear" color="#ff5a5a" size="18" v-if="info.check_error_level==2"></icon>
					<icon type="success" color="#cccccc" size="18"  v-if="info.is_check==0||(info.check_error_level==1&&info.is_check==-1&&info.check_error_level!=2)||info.is_check==1"></icon>
				</view>
				<text class="left shenhe-part ma_top" v-if="info.is_check==2||info.is_check==3||info.check_error_level==3">业务总监审核已通过</text>
				<text class="left shenhe-part ma_top"  style="color: #ff5a5a;" v-if="info.check_error_level==2">业务总监审核已驳回</text>
				<text class="left shenhe-part ma_top" style="color: #a1a1a1;"  v-if="info.is_check==0||(info.check_error_level==1&&info.is_check==-1&&info.check_error_level!=2)||info.is_check==1">待业务总监审核</text>
				<text class="right" style="margin-top: 20rpx;">{{info.jindu_time3}}</text>
			</view>
			<view class="process" v-if="info.is_check==0||(info.check_error_level==1&&info.is_check==-1&&info.check_error_level!=2)||info.is_check==1" style="color: #a1a1a1;border-left:1px solid #a1a1a1 ;">
				
			</view>
			<view class="process" v-if="info.is_check==2||info.is_check==3||info.check_error_level==3">
				{{info.check_user2_name}}
			</view>
			<view class="process"  style="color: #ff5a5a;border-left:1px solid #ff5a5a ;" v-if="info.check_error_level==2">
				{{info.error_reason}}
			</view>
			<!-- 三级审核———————————————————————— -->
			<view class="clear shenhe-text">
				<view class="left">
					<icon type="success"  size="18" v-if="info.is_check==3"></icon>
					<icon type="clear" color="#ff5a5a" size="18" v-if="info.check_error_level==3"></icon>
					<icon type="success" color="#cccccc" size="18"  v-if="info.is_check!=3&&info.check_error_level!=3"></icon>
				</view>
				<text class="left shenhe-part ma_top"  v-if="info.is_check==3">财务审批已完成</text>
				<text class="left shenhe-part ma_top"  style="color: #ff5a5a;" v-if="info.is_check==-1&&info.check_error_level==3">财务审批已驳回</text>
				<!-- <text class="left shenhe-part ma_top" style="color: #a1a1a1;" v-if="((info.is_check<3||info.is_check!=-1)||!isbohui3)">待银行审批</text> -->
				<text class="left shenhe-part ma_top" style="color: #a1a1a1;"  v-if="info.is_check!=3&&info.check_error_level!=3">待财务审批</text>
				<text class="right" style="margin-top: 20rpx;">{{info.jindu_time4}}</text>
			</view>
			
			<view class="process"  style="border: none;" v-if="info.is_check==3">
				{{info.bank_user_name}}
			</view>
			<view class="process"  style="color: #ff5a5a;border: none;" v-if="info.check_error_level==3">
				{{info.error_reason}}
			</view>
		</view>
		<view class="clear" style="margin: 60rpx 20rpx;" v-if="btn_show">
			<button class="info_btn left" @tap="bohui()">驳回申请</button>
			<button class="info_btn right" @tap="shenhe(1)">同意申请</button>
		</view>
		<view class="menban" v-show="isalert">
			<view class="gray"></view>
				<view class="menban-content" style="top:calc(50% - 200rpx);left: 10%;right: 10%;border-radius:5px ;">
					<view class="line_title " style="position: relative;text-align: center;color: #323232;font-size: 34rpx;padding-top: 10px;">
						请填写驳回原因
						<image src="../../static/img/close-icon.png" class="close-icon" @tap="isalertAction()"></image>
					</view>
					<textarea class="bohui-textarea" placeholder="请填写驳回原因" v-model="error_reason" placeholder-style="font-size:30rpx"></textarea>
					<button class="big_button" style="margin: 30rpx auto;" @tap="shenhe(-1)">
						确认
					</button>
				</view>
		
			
		</view>
	</view>
</template>

<script>
	import httpPath from '@/static/js/path.js';
	import {getlogin} from '@/static/js/login.js';
	import {fmoney} from '@/static/js/login.js';
	import {timestampToDate} from '@/static/js/login.js';
	import {timestampToDate1} from '@/static/js/login.js';
	import {timestampToDate2} from '@/static/js/login.js';
	export default {
		data() {
			return {
				isalert:false,//驳回弹出框是否弹出
				current:0,
				iconType: ['success'],
				id:"",
				user:{},
				info:{},
				hetong:[],
				error_reason:"",
				btn_show:false,
			}
		},
		onLoad(option) {
	        this.user = getlogin();
	        if(!this.user.islogin){
	        	uni.showModal({
	        	   showCancel:false,
	        	   content:"您还没有登录，请登录"
	        	})
	        	uni.navigateTo({
	        		url:"../public/login"
	        	})
	        }	
			this.id=option.id;
			if(this.id){
				this.getinfo()
			}else{
				uni.navigateBack()
			}
			
		},
		methods: {
			showbtn(){
				if(this.info.member_top==1&&this.info.is_check<1&&this.info.is_check!=-1){
					this.btn_show=true;
				}else{
					this.btn_show=false;
				}
				if(this.info.member_top==2&&this.info.is_check<2&&this.info.is_check!=-1){
					this.btn_show=true;
				}
				if(this.info.member_top==3&&this.info.is_check!=3&&this.info.is_check!=-1){
					this.btn_show=true;
				}
				
				
			},
			lookmore(id){
				uni.navigateTo({
					url:"/pages/myself/kehuinfo?id="+id
				})
			},
			shenhe(is_check){
				let param={};
				if(is_check=="-1"){
					if(this.error_reason==""||this.error_reason==null){
						uni.showModal({
							showCancel:false,
							content:"请输入驳回原因"
						})
						return false;
					}
								
				}
				param.member_id=this.user.member_id;
				param.user_id=this.user.user_id;
				param.is_check=is_check;
				param.error_reason=this.error_reason;
				param.id=this.id;
				uni.request({
				      url: httpPath.filePath+"/api.php/index/user/loan_check/",
				      method:'POST',
				      header:{'content-type':'application/x-www-form-urlencoded'},
				      data: param,
				      success: (res) => {
				  		if(res.data.code=="200"){
							if(is_check==1){
								uni.showModal({
									showCancel:false,
									content:"审核已完成"
								})
								this.getinfo();
								this.btn_show=false;
							}else{
								uni.showModal({
									showCancel:false,
									content:"您已经将资料驳回了"
								})
								this.isalert=false;
								this.btn_show=false;
								this.getinfo();
								
							}
							// this.getinfo();
						}else{
							uni.showModal({
								showCancel:false,
								content:res.data.message
							})
						}
						
				      }
				});
			},
		  getinfo(){
			  uni.request({
			      url: httpPath.filePath+"api.php/index/user/loan_detail/",
			      method:'POST',
			      header:{'content-type':'application/x-www-form-urlencoded'},
			      data:{member_id:this.user.member_id,user_id:this.user.user_id,id:this.id} ,
			      success: (res) => {
			  		 if(res.data.code=="200"){
						 this.info=res.data.result;
						 this.info.capital=fmoney(this.info.capital)
						 if(res.data.result.addtime!=""){
						 	
						 	 this.info.jindu_time1=timestampToDate2(res.data.result.addtime)
						 }
						 if(res.data.result.checktime1!=""){
						 	 this.info.jindu_time2=timestampToDate2(res.data.result.checktime1)
						 }
						 if(res.data.result.checktime2!=""){
						 	 this.info.jindu_time3=timestampToDate2(res.data.result.checktime2)
						 }
						 if(res.data.result.checktime3!=""){
						 	 this.info.jindu_time4=timestampToDate2(res.data.result.checktime3)
						 } 
						 if(this.info.addtime!=""){
							  this.info.addtime=timestampToDate1(this.info.addtime)
						 }
						if(this.info.checktime1!=""){
							this.info.checktime1=timestampToDate1(this.info.checktime1)
						}
						if(this.info.checktime2!=""){
							 this.info.checktime2=timestampToDate1(this.info.checktime2)
						}
						if(this.info.checktime3!=""){
							 this.info.checktime3=timestampToDate1(this.info.checktime3)
						}
						if(this.info.endtime!=""){
							 this.info.endtime=timestampToDate1(this.info.endtime)
						}
						
						 if(this.info.hetong.length!=0){
							 this.hetong=[];
							 for (let i=0;i<this.info.hetong.length;i++) {
							 	 this.hetong.push({"url":httpPath.filePath+"/static/upload/image/"+this.info.hetong[i]})
							 }
							
						 }
						 if(this.info.check_user_name){
						 	this.info.check_user_name = "审核人:"+this.info.check_user_name
						 }else{
						 	this.info.check_user_name = "待审核"
						 }
						 if(this.info.check_user2_name){
						 	this.info.check_user2_name = "审核人:"+this.info.check_user2_name
						 }else{
						 	this.info.check_user2_name = "待审核"
						 }
						 if(this.info.bank_user_name){
						 	this.info.bank_user_name = "审核人:"+this.info.bank_user_name
						 }else{
						 	this.info.bank_user_name = "待审核"
						 }
						 this.showbtn()
					 }
			      }
			  });
		  },
			// 预览图片
	      yulan(img){
		    uni.previewImage({
				  urls: [img],
				  longPressActions: {
					  // itemList: ['发送给朋友', '保存图片', '收藏'],
					  success: function(data) {
						  console.log('选中了第' + (data.tapIndex + 1) + '个按钮,第' + (data.index + 1) + '张图片');
					  },
					  fail: function(err) {
						  console.log(err.errMsg);
					  }
				  }
		    });
		  }
		  ,bohui(){//开启驳回弹出框
			  this.isalert=true;
		  },isalertAction(){//关闭驳回弹出框
			  this.isalert=false;
		  }
		}
	}
</script>

<style>
	@import "../../colorui/main.css";
	.bohui-textarea{display: block;margin: 10px;background: #f3f3f3;padding: 5px;height: 300rpx;width: 92%;border-radius: 5px;}
	.info_btn{width: 300rpx;border-radius: 40rpx;height: 80rpx;line-height: 80rpx;font-size: 30rpx;}
	.info_btn:nth-of-type(1){border:  1px solid #1e99ff;color: #1e99ff;}
	.info_btn:nth-of-type(2){background: #1e99ff;color: #FFFFFF;}
	/* .process{min-height: 100rpx;border-left: 1px solid #1e99ff;margin-left: 20rpx;margin-bottom: 10rpx;padding-left: 30rpx;} */
	.info_more{position: absolute;top: 0rpx;right: 10rpx;display: block;width: 150rpx;text-align:center;color: #FFFFFF;font-size: 28rpx;line-height: 40rpx;height: 40rpx;background: #1e99ff;border-radius: 20rpx;}
    .ma_top{margin-top: 12px!important;}
	.info_title{padding-bottom: 8px;margin-bottom: 8px;}
	.process{color: #666666;}
	.info_more{margin-top: 10rpx;}
</style>
